
// 定义一个类
class BgObj {
    // 构造方法接受一个数组
    /**
     * [    
        {image : 'assets/img/backgrounds/1.jpg'},
        {image : 'assets/img/backgrounds/2.jpg'},
        {image : 'assets/img/backgrounds/3.jpg'}
    ]
    * @param {*} speed  过度速度
     * @param {*} arr  背景数组
    */
    constructor(speed,arr){
        this.speed = speed
        this.arr = arr
    }

    getArr(){
        return this.arr
    }

    // 开始方法
    start(){
        let arr = this.getArr()
        let html = `<ul class="speed" style="visibility: visible;">`
        arr.forEach((e,i) => {
            let imgUrl = e.image
            html += `<li class="slide-${i}" ><a target="_blank"><img src="${imgUrl}" bg></a></li>`
        });
        html += `</ul>`
        $("#div").html(html)
        // 调用定时器
        this._startTime()
    }

    _startTime(){
        let index = 0;
        let that = this
        that._addBg(index)
        setInterval(function(){
            that._removeBg()
            that._addBg(index)

            let ind = index+1
            console.log(that.arr.length)
            if(ind > that.arr.length -1 ){
                index = 0    
            }
            else{
                index = ind
            }
        },this.speed)
    }

    _removeBg(){
        let length = this.arr.length
        for (let index = 0; index < length; index++) {
            let item = $(".slide-"+index)
            item.removeClass('active')
        }
    }
    _addBg(index){
        let item = $(".slide-"+index)
        item.addClass('active')
    }
}